<template>
	<view class="shopNotice">
		<view class="shopNotice-index">
			<image :src="detail.icon" @tap="$emit('nav')" class="shopNotice-index_left" mode="widthFix"></image>
			<text class="xian"></text>
			<!-- <image src="../../static/image/mine/discount/area.png"></image> -->
			<!-- <sc-no-bar :swiperList="data" autoplay="true" circular="true" :duration="500" :interval="3000"></sc-no-bar> -->
			<view class="uni-swiper-msg-on">
				<view class="uni-swiper-msg-myflex">
					<swiper class="limitp-hg" :vertical="vertical" :autoplay="autoplay" :circular="circular" :interval="interval">
						<swiper-item v-for="(item, index) in dataArr" :key="index">
							<!-- <navigator class="scrool-list-item" :url="'../all/content?id='+item.id+'&type=1'">{{item.title}}</navigator> -->
							<text class="scrool-list-item" @tap="$emit('nav')">{{item.title}}</text>
						</swiper-item>
					</swiper>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import scNoBar from './sc-no-bar.vue';
	export default {
		components:{scNoBar},
		props:{
			detail:{
				type:Object
			},
			dataArr:{
				type:Array
			},
			interval:{
				type:Number,
				default:3000
			},
			autoplay:{
				type:[Boolean, String],
				default:true
			},
			vertical:{
				type:[Boolean, String],
				default:true
			},
			circular:{
				type:[Boolean, String],
				default:true
			},
			duration:{
				type:Number,
				default:500
			}
		},
		data() {
			return {
				Url:this.Imgurl
			};
		}
	}
</script>

<style lang="less">
	.img-iocn{
		width: 50rpx;
		height: 50rpx;
	}
	.scrool-list-item{
		color: red;
	}
		
		.uni-swiper-msg-myflex{
			display: flex;
		}
		
		.left-Iocn{
			display: flex;
			align-items: center;
			image{
				width: 42upx;
				height:41upx;
			}
			margin-right:34upx;
		}
		
		.limitp-hg{
			width:500upx;
			overflow: hidden;
			height: 60rpx;
			line-height: 60rpx;
		}
		
		.scrool-list-item{
			font-size: 24upx;
			color: #333333;
		}
.shopNotice{
	padding:28upx;
	background-color: #FFFFFF;
	// background: #F9F9F9;
	&-index_left{
		width:200upx;
		height:50upx;
	}
	.shopNotice-index{
		background: #F9F9F9;
		width: 100%;
		height:66upx;
		line-height:66upx;
		border-radius: 10upx;
		overflow: hidden;
		font-size:24upx;
		display: flex;
		align-items: center;
		padding: 19upx 20upx;
		box-sizing: border-box;
		.xian{
			width: 2upx;
			height: 26upx;
			background-color: #DDDDDD;
			margin: 0 20upx;
		}
		// image{
		// 	width: 40upx;
		// 	height: 40upx;
		// 	top: 50%;
		// 	padding-left: 30upx;
		// 	padding-right: 10upx;
		// 	transform: translate(0 ,-50%);
		// }
	}
		
}
</style>
